//import { RouteConfig } from "react-router-config";
//import React, { Suspense, lazy } from "react";
import React, { useEffect } from "react";
import loadable from "@loadable/component"; //动态加载组件
import { message } from "antd";
import { Redirect } from "react-router-dom";
import { Route, Switch } from "react-router";
import Login from "pages/Unauthenticated/login";
import DefaultLayout from "pages/Layout";
import Notfound from "pages/404";
/* import Home from "pages/Authenticated/home/home";
import About from "pages/Authenticated/about/about";
import Sub from "pages/Authenticated/about/sub/sub"; */

export const menuroutes = [
  {
    path: "/",
    id: "3-1-1",
    exact: true,
    hidden: true,
    name: "首页",
    render: () => <Redirect to="/home" />,
  },
  {
    path: "/home",
    id: "3-1-2",
    name: "主页",
    component: loadable(() => import("pages/Authenticated/home/home")),
  },
  {
    path: "/about",
    name: "关于",
    id: "3-1-3",
    component: loadable(() => import("pages/Authenticated/about/about")),
    routes: [
      {
        path: "/about/sub",
        id: "3-1-3-1",
        name: "子页面",
        component: loadable(() => import("pages/Authenticated/about/sub/sub")),
      },
    ],
  },
  {
    path:'/upload',
    id:'3-1-4',
    name:'上传',
    component:loadable(()=>import("pages/Authenticated/upload/upload"))
  },
  {
    path:'/down',
    id:'3-1-5',
    name:'下载',
    component:loadable(()=>import('pages/Authenticated/down/down'))
  },
  {
    id: "404",
    hidden: true,
    render: () => <Redirect to="/404" />,
  },
];

const routes = [
  {
    id: "1",
    path: "/login",
    name: "登陆",
    pubilic: true,
    component: Login,
  },
  {
    path: "/404",
    id: "2",
    name: "页面未找到",
    component: Notfound,
  },
  {
    path: "/",
    id: "3",
    name: "首页",
    component: DefaultLayout,
    routes: menuroutes,
  },
];

export const renderRoutes = (routes, extraProps = {}, switchProps = {}) => {
  return routes ? (
    <Switch {...switchProps}>
      {routes.map((item, i) => (
        <Route
          key={item.name || i}
          path={item.path}
          exact={item.exact}
          strict={item.strict}
          render={(props) => routeRender(item, props, extraProps)}
        />
      ))}
    </Switch>
  ) : null;
};

const routeRender = (route, props, extraProps) => {
  const login = !sessionStorage.getItem("token") && !route.pubilic;
  if (login) {
    return <RedirectLogin />;
  } else {
    return route.render ? (
      route.render({ ...props, ...extraProps, route: route })
    ) : (
      <route.component {...props} {...extraProps} route={route} />
    );
  }
};

const RedirectLogin = (props) => {
  useEffect(() => {
    message.error("未登录，请先登陆！");
  }, []);
  return <Redirect to="/login" />;
};

export default routes;
